import React, { Component } from 'react';
import {
	observer,
	inject,
} from 'mobx-react';
import {  Flex, Tools ,Icon} from 'weaver-mobile';
import {
	RouteLayout,
} from 'weaver-mobile-page';
import { configNavigation } from "../../util/public-func";
import "../../style/group.less";
import NoData from "../coms/NoData";
const getLabel = Tools.getLabel;

const template = [{
	key: "0",
	name:getLabel('521509','标题') ,
	datas:["suggesttitlespan","suggesttypespan"]
},{
	key:"1",
	name:getLabel(616, "提交人") ,
	datas:["createrspan"]
},{
	key:"2",
	name:getLabel('520240','提交日期') ,
	datas:["createdatespan"]
},{
	key:"3",
	name:getLabel('518818','相关公共组') ,
	datas:["namespan"]
},{
	key:"4",
	name: getLabel(15821, "调整类型") ,
	datas:["suggesttypespan"]
},{
	key:"5",
	name: getLabel(505586, "详情") ,
	datas:["contentspan"]
}]

@inject('groupStore')
@observer
export default class SuggestDetail extends Component {
	componentWillMount() {
		const {
			location,
			groupStore
		} = this.props, {
			setSource
		} = groupStore;

		//确定是否是单页
		if (location && location.pathname.includes("suggestDetail")) {
			setSource("suggest");
		}

	}

	componentDidMount() {
		const {
			location,
			groupStore
		} = this.props, {
			source,
			getSuggestList,
			splitUrl
		} = groupStore;
		
		configNavigation(getLabel('518816','公共组调整建议单'))

		//单页打开
		if (source === "suggest") {
			const { targetId } = splitUrl(location.search);
			getSuggestList({ detailInfo:"1", targetId });
		}
	}

	componentWillUnmount() {
		configNavigation(getLabel(126253, "公共组调整建议"));
	}

	handlePubClick = (id) => {
		if (window.em && window.em.checkJsApi('openLink')) {
			window.em.openLink({
				url: `/spa/hrm/static4mobile/index.html#/groupOp?id=${id}&type=1`,
		        openType: 2,
		        sysId: window.localStorage.emobile_ec_id
			});
		}
	}
	
	render() {
		const {
			groupStore
		} = this.props, {
			suggestDetail,
			suggestDetailBtns
		} = groupStore;

		if (Object.keys(suggestDetail).length === 0) 
			return <NoData />;

		return (
			<div className="suggest-detail">
				{  template.map(item => {
					const {key, name ,datas} = item;
					return (
						<div key={key} className="suggest-detail-item">
							<Flex>
								<Flex.Item style={{flex: 1}}>{name}</Flex.Item>
								<Flex.Item style={{flex: 2}}>{datas.map( (data,index) =>{
									return (
										<span>
											{ (index > 0) && "-" }
											{ (data !== "namespan") ? suggestDetail[data] : <a className="suggest-detail-link" onClick={ () => this.handlePubClick(suggestDetail.groupidspan) }>{ suggestDetail[data] }</a> }
										</span>
									)
								} )}</Flex.Item>
							</Flex>
						</div>
					)
				})}
				<RouteLayout.ButtonGroup data={suggestDetailBtns} />
			</div>
		);
	}
}